import * as React from 'react'
import { Route, Switch } from 'react-router-dom'
import { TabBar } from 'components'
import Home from './Home'
import Search from './Search'

const TabItem = TabBar.Item

export default () => {
    return (
        <div>
            <Switch>
                <Route component={Home} path="/" />
                <Route component={Search} path="/search" />
            </Switch>
            <TabBar
                fixed={true}
                style={{ height: '2.5rem' }}
            >
                <TabItem
                    label="主页"
                    icon={<img src={require('../assets/home.png')} />}
                />
                <TabItem
                    label="分类"
                    icon={<img src={require('../assets/all.png')} />}
                />
                <TabItem
                    label="买豆"
                />
                <TabItem
                    label="购物车"
                    icon={<img src={require('../assets/shop_icon.png')} />}
                />
                <TabItem
                    label="我的"
                    icon={<img src={require('../assets/my_icon.png')} />}
                />
            </TabBar>
        </div>
    )
}